<template>
  <div class="event-and-new">
    <!--面包屑-->
    <div class="crumbs">
      <Crumbs :crumbs_title="crumbs_title"/>
    </div>
    <div class="event-title">
      <h1 class="h1">event and news</h1>
      <h2 class="h2">活动及品牌新闻</h2>
    </div>
    <router-view/>
  </div>
</template>

<script>
import Crumbs from '@/components/Crumbs'
export default {
  name: 'EventAndNews',
  data () {
    return {
      totalPage: 100,
      crumbs_title: '活动及品牌新闻'
    }
  },
  components: {
    Crumbs
  }
}
</script>

<style scoped lang="less">
.event-and-new{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;

  // 标题
  .event-title {
    height: 66px;
    border-bottom: 2px solid #83B8D3;
    font-family: "微软雅黑";
    position: relative;
    margin-bottom: 20px;
    width: 980px;
    text-align: left;
    padding-bottom: 20px;
    .h1 {
      font-weight: normal;
      font-size: 23px;
      color: #ABBDEB;
      text-transform: uppercase;
      height: 23px;
      line-height: 23px;
    }

    .h2 {
      font-weight: normal;
      font-size: 30px;
      color: #26355B;
      height: 30px;
      line-height: 30px;
      transform: translateY(-25px);
    }
  }
}
</style>
